<template>
    <div>
        <div style="text-align: center;padding: 10% 0;">
            <p style="color: #fff;font-size: 24px;">登录</p>
        </div>
        <form class="container-fluid" style="height: 100%;">
            <div class="form-group">
                <label style="color: #fff;">手机号</label>
                <input v-model="mobile_number" style="color: #00a0e9" type="text" class="form-control" placeholder="" required>
            </div>
            <div class="form-group">
                <label style="color: #fff;">请输入密码</label>
                <div class="input-group">
                    <input v-model="password" type="password" class="form-control" placeholder="" required>
                    <div class="input-group-btn">
                        <div class="btn btn-primary" @click="login"><img width="20"
                                                                            src="../../assets/img/right-white.png">
                        </div>
                    </div>
                </div>
            </div>
        </form>

        <div style="margin-top: 10%;text-align: center">
            <button @click="wxlogin" style="border: none;background-color: #fff;color: #00a0e9;width: 50%;height: 50px;border-radius: 25px;">微信登录</button>
        </div>
    </div>
</template>
<script>
    import swal from "sweetalert";

    export default {
        data() {
            return {
                mobile_number: '',
                password: '',
            }
        },
        created() {
        },
        beforeDestroy() {
            document.querySelector('body').setAttribute('style', 'background-color:rgb(249,249,249);');
        },
        mounted() {
            document.querySelector('body').setAttribute('style', 'background-color:#4565b2;');
        },
        methods: {
            login() {
                if (this.mobile_number == '' || this.password == '') {
                    return;
                }
                this.api.postLogin(this.mobile_number, this.password).then(res => {
                    if (res.meta.code == '000') {
                        localStorage.setItem("wx_openid", res.data.wx_openid);
                        let url = localStorage.getItem("now_url");
                        window.location.replace(url);
                    } else {
                        swal(res.meta.msg);
                    }
                });
            },
            wxlogin() {
                let host = 'http://qczh.xiuyiwenhua.com';
                let randomParams = '&state=lajiweixin'; // 随机参数（可不传）
                let redirect_uri = encodeURIComponent(`${host}/wx-auth`);

                window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx5c938f141335a996&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo${randomParams}#wechat_redirect`;
            }
        },
    }
</script>
<style>



</style>
